// 基于 axios 封装的请求模块
import axios from 'axios'
// import router from '../router'
import store from '../store'
// 新建一个新的axios实例
const ajax = axios.create({
  baseURL: 'http://toutiao.itheima.net' // 基地址
})
const refreshTokenAPI = () => ajax({
  url: '/v1_0/authorizations',
  method: 'PUT',
  headers: {
    Authorization: `Bearer ${store.state.refresh_token}`
  }
})
// 添加请求拦截器
ajax.interceptors.request.use(config => {
  // 对token 做统一处理,如果vuex中有token,则在请求头中通过Authorization字段携带给后台
  if (store.state.token) {
    config.headers.Authorization = 'Bearer ' + store.state.token
  }
  return config
}, error => {
  return Promise.reject(error)
})

// 添加响应拦截器 可以对返回数据 或者 错误(token过期) 统一处理
ajax.interceptors.response.use(resp => { // 状态码以2xx或3xx开头,执行成功的回调
  return resp.data
}, async error => { // 状态码以4xx或5xx开头,执行失败的回调
  console.dir(error)
  // 401就是一个典型的失败,表示token过期或者无效
  // token过期的解决办法
  if (error.response.status === 401) {
    // // 1.清空vuex中token
    // store.commit('setToken', '')
    // // 2.跳转到登录页重新登录
    // router.replace({
    //   path: '/login'
    // })
    store.commit('setToken', '')
    const res = await refreshTokenAPI()
    store.commit('setToken', res.data.token)
    // 再调用一次未完成的请求啊(用户无感知)
    // error.config 就是上一次axios请求的配置对象
    // console.dir(error.config)
    // 把新的token赋予到下一次axios请求的请求头中
    error.config.headers.Authorization = 'Bearer ' + res.data.token
    // return到await的地方
    return ajax(error.config)
  }
  return Promise.reject(error)
})
// 导出自定义函数, 参数对象解构赋值
export default ajax
